<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<!-- 导入jQuery库 -->
	<script type="text/javascript" src="../../lib/jquery/jquery-1.11.3.min.js" ></script>
	<script>
		$(function(){
			var tbody = $("#mainFrame",window.parent.document).find("#tab_repoty tbody");
			console.log(tbody);
		});
		
	</script>
	
	
	<script type="text/javascript" >
		//网页刚进来就执行
		document.ready = function(){
			alert("window.document.ready 222");
		}		
		
		//DOM全部加载完毕执行
		window.onload = function(){
			alert("window.onload 222");
			var mainFrame = window.parent.document.getElementById("mainFrame");
			var parentH = mainFrame.contentDocument.body.clientHeight;//父窗口的高度320
			var selfH = window.document.body.clientHeight;//父窗口的高度320
			alert(parentH + " , "+ selfH);
			console.log(window.document.body);
//			console.log(mainFrame.contentWindow.document.body.clientHeight);//320
			mainFrame.setAttribute('style', 'overflow:scroll;border: 10px blue solid;width: 550px;height:'+ h +'px; !important');
		}
	</script>
	</head>
	<body>
		<div style="border: 10px skyblue solid;width: 300px;height: 300px;">
			这个是内部嵌套的iframe
		</div>
		<table id="tab_repoty">
			<thead>
				<tr>
					<td>1</td><td>2</td><td>3</td>
				</tr>
			</thead>
			<tbody>
				
			</tbody>
		</table>
		
	</body>
	<script>
			//调整嵌套的iframe的窗口大小
	window.document.ready = function(){
// 		var mainFrame = window.parent.parent.document.getElementById("mainFrame");
// // 		var h = window.document.body.clientHeight;//320
// 		var h = window.document.body.scrollHeight;//560
// 		var h2 = window.screen.availHeight;
// 		var h3 = document.getElementById("table_report").offsetHeight;
// 		var h4 = document.body.scrollWidth;
// 		var h5 = document.body.offsetHeight;
// 		console.log(h3);
// 		alert(h+","+h2+","+h3+","+h4+","+h5);
// 		mainFrame.setAttribute('style', 'margin:0 auto;width:100%;height:100%;min-height:'+ h3 +'px; !important');
	}
	
// 	$(function(){
// 		var mainFrame = window.parent.parent.document.getElementById("mainFrame");
// 		alert(mainFrame);
// 		console.log(mainFrame);
// 	    mainFrame.setAttribute('style', 'margin:0 auto;width:100%;height:100%;min-height:500px; !important');
// 	});
	</script>

<p id="sp">这个是iframe包裹的窗体的一段话</p>
<button id="getPar">原生JS获得嵌套的iframe的内容和方法</button>
<button id="getParjQuery">jQuery获得嵌套的iframe的内容和方法</button>
<script>
	function sf(){
		console.log("这个是子窗体的  sf() 方法");
	}
	
	// 原生JS
	// 原生JS方法
	document.getElementById("getPar").onclick = function(){
		// 获得 iframe 嵌套的窗体对象
		var obj = window.parent; // 获得父窗体对象
		var fp = obj.document.getElementById("fp").innerHTML; 
		console.log("obj:"+obj)
		console.log("fp:"+fp)
		obj.pf(); // 调用iframe嵌套窗体的方法
		
	}
	
	// 使用jQuery方法
	$("#getParjQuery").click(function(){
		var fp = $('#fp', parent.document).text(); // 获得父窗体的元素
		console.log("fp:"+fp);
		window.parent.pf(); // 使用原生的JS调用父窗体的方法
	});
	
</script>	
</html>
